<template>
  <div class="m-detialSearchTablePadding">
    <div class="m-searchListPanel">
      <div class="layout-1"><span class="leftLine"></span>信息列表</div>
    </div>
    <div class="layout-2">
      <div class="m-dataList">
        <el-table
          :data="dataList"
          style="width: 100%"
          v-loading="dataListLoading"
          element-loading-text="loading..."
          ref="dataList"
          max-height="700"
        >
          <el-table-column
            prop="operator"
            width="120"
            label="操作人">
          </el-table-column>
          <el-table-column
            prop="time"
            label="时间"
            width="160">
          </el-table-column>
          <el-table-column
            prop="function"
            label="组块"
            width="200">
          </el-table-column>
          <el-table-column
            prop="content"
            label="内容">
            <template slot-scope="scope">
             <div v-html="scope.row.content"></div>
            </template>
          </el-table-column>
        </el-table>
      </div>
      <div class="m-pagination">
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :page-sizes=pagination.pageSizeList
          :current-page=pagination.pageNo
          :page-size=pagination.pageSize
          layout="total, sizes, prev, pager, next"
          :total=pagination.total>
        </el-pagination>
      </div>
    </div>
  </div>
</template>

<script>
  import * as LogAPI from '@/Api/log'
  import * as Utils from '@/utils'
  export default {
    name: 'TheLog',
    data () {
      return {
        pagination: Utils.commonPagination(),
        dataList: [],
        dataListLoading:false,
      }
    },
    props: {
      type: {
        default: '2',
      }
    },
    methods:{
      handleSizeChange(size) {
        this.pagination.pageSize = size;
        if(this.pagination.pageNo == 1) {
          this.queryList();
        } else {
          this.pagination.pageNo = 1;
        }
      },
      handleCurrentChange(index) {
        this.pagination.pageNo = index;
        this.queryList();

      },
      queryList(){
        this.dataListLoading = true;
        if (this.$refs.dataList) {
          this.$refs.dataList.bodyWrapper.scrollTop = 0;
        }
        LogAPI.logEditQuery({
          type: this.type,
          typeId: this.$route.params.id.split('_')[0],
          phone:this.$route.params.id.split('_')[1],
          pageNo: this.pagination.pageNo,
          pageSize: this.pagination.pageSize,
        })
          .then(res => {
            this.dataListLoading = false;
            if (res.code != 0) {
              this.$notify.warning({
                title: '温馨提示',
                message: res.msg
              })
              return;
            }
            this.dataList = res.data.content;
            this.pagination.total = res.data.totalElements;
          })
          .catch(error => {
            this.dataListLoading = false;
            console.log(error)
          })
      },
    },
    created(){
      this.queryList();
    }
  }
</script>

<style scoped lang="scss">
</style>
